<template>
  <div class="form-group" >
      <label :for="id" :class="labelClass" :style="finalLabelStype"><span v-if="required" class="required ">*</span>{{title}}：</label>
      <div :class="rightClass" :style="rightStyle">
        <form-pop :content="error"/>
        <a-textarea  :id="id" :name="name" @change="onChange" :title="value" :value="value"   :auto-size="{ minRows: 3, maxRows: 5 }"/>
      </div>
  </div>
</template>

<script>
import formAttr from "@/mixins/form/form-attr";

const defaultLabelStype =
  "font-weight: normal;justify-content: flex-end;padding-left: 5px;text-align: right;width:110px;";
export default {
  name:"FormTextArea",
  mixins:[formAttr],
  props:{
     
  },
  
  computed:{
      finalLabelStype: function(){
          return this.labelStyle || defaultLabelStype ;
      },
  },
  methods:{
    onChange(event){
       console.log("Area_change",event.target.value)
        this.$emit('input', event.target.value);
      }
  }
}
</script>

